import React from 'react';
import {inject, observer} from 'mobx-react';
import {Button, Col, Radio, Row, Spin, Tooltip} from 'antd';
import {
    WeaBrowser,
    WeaLeftRightLayout,
    WeaCheckbox,
    WeaFormItem,
    WeaLocaleProvider,
    WeaInputNumber,
    WeaPopoverHrm,
    WeaRightMenu,
    WeaSearchGroup,
    WeaSelect,
    WeaTab,
    WeaTop,
} from 'ecCom';
import {WeaTableNew} from "comsMobx";
import PersonTree from '../../../public/persontree/PersonTree'
import {renderAlertPage, setWindowKeys} from '../../../util/Util';
import AccessResultSend from './AccessResultSend'
import AccessAgent from './AccessAgent'

const RadioGroup = Radio.Group;
const RadioButton = Radio.Button;
const WeaTable = WeaTableNew.WeaTable;
const getLabel = WeaLocaleProvider.getLabel;

/**
 * 绩效-考核成绩
 */
@inject("accessResultListStore")
@observer
export default class AccessResultList extends React.Component {

    constructor(props) {
        super(props);
        //tab操作后更新列表数据
        window.RefreshAccessResultList = () => {
            this.props.accessResultListStore.tableStore.reloadCurrent();
            this.props.updateNum();
        }
        this.state = {
            showLeft: false, //是否显示左侧栏
            collectParams: {
                favname: getLabel(506161, "考核成绩"),
                favouritetype: "5",
                link: '/spa/workrelate/static/index.html#/main/workrelate/performance/performanceIndex?menutype=1',
                importantlevel: 1,
            }
        };
        this.store = this.props.accessResultListStore;
    }

    componentWillMount() {
        setWindowKeys(1, getLabel(506161, "考核成绩"));
        this.store.doInit();
    }

    componentDidMount() {
        this.store.initLabel();
    }

    componentWillUnmount() {
        window.RefreshAccessResultList = null
    }

    render() {
        const {
            loading, tableStore, topTab, queryParams, yearDatas, monthdata, seasondata, nowmonth, nowseason, queryParams: {type1, year},
            setShowSearchAd, showSearchAd, isEnableCycle: {isfyear, ishyear, isquarter, ismonth}
        } = this.store;
        const {collectParams} = this.state;
        //暂未开启任何考核周期
        if (!isfyear && !ishyear && !ismonth && !isquarter) {
            return renderAlertPage('<span style="color:red">' + getLabel(508557, "暂未开启任何考核周期") + '</span>','','','', this.props.ecId || '')
        }
        return (
            <div className="wea-workrelate-performance-resultlist" style={{height: "100vh"}}>
                <Spin ecId={`${this && this.props && this.props.ecId || ''}_Spin@jflieg`} spinning={loading}>
                    <div style={{height: "100vh"}}>
                        <WeaRightMenu ecId={`${this && this.props && this.props.ecId || ''}_WeaRightMenu@lay523`} datas={this.getMenus()} collectParams={collectParams}>
                            <WeaPopoverHrm ecId={`${this && this.props && this.props.ecId || ''}_WeaPopoverHrm@2fbc8f`}/>
                            <WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@5djuen`}
                                title={getLabel(508620, '考核成绩查询列表')}
                                icon={<i className='icon-coms-implement'/>}
                                iconBgcolor='rgb(150, 53, 138)'
                                showDropIcon
                                buttons={this.getButtons(this.props.ecId || '')}
                                dropMenuDatas={this.getMenus()}
                            />
                            <WeaLeftRightLayout ecId={`${this && this.props && this.props.ecId || ''}_WeaLeftRightLayout@czgs9k`}
                                isNew={true}
                                showLeft={true}
                                leftWidth={220}
                                leftCom={<PersonTree ecId={`${this && this.props && this.props.ecId || ''}_PersonTree@k4slj2`} onPersonClick={this.onPersonClick}
                                                     treeNodeClick={this.treeNodeClick}/>}
                                showLeft={this.state.showLeft}
                                onCollapse={showLeft => this.setState({showLeft})}
                            >
                                <WeaTab ecId={`${this && this.props && this.props.ecId || ''}_WeaTab@9czglb`}
                                    datas={topTab}
                                    searchType={["advanced"]}
                                    showSearchAd={showSearchAd}
                                    hideSearchAd={() => setShowSearchAd(false)}
                                    keyParam="viewcondition" //主键
                                    selectedKey={queryParams.type1}
                                    onChange={v => this.typeOnChange(v)}
                                    setShowSearchAd={bool => setShowSearchAd(bool)}
                                    buttonsAd={this.getTabButtonsAd(this.props.ecId || '')}
                                    searchsAd={this.getSearchsAd()}
                                />
                                <div className='year-date'>
                                    <span>
                                        <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@llhzm2`}
                                            options={yearDatas}
                                            value={year}
                                            onChange={(val) => this.yearOnChange(val)}
                                        />
                                        {type1 == 1 && <RadioGroup ecId={`${this && this.props && this.props.ecId || ''}_RadioGroup@v1vjj4`} onChange={(e) => this.monthOnChange(e.target.value)}
                                                                   value={nowmonth} style={{verticalAlign: "bottom"}}>
                                            {monthdata && monthdata.length > 0 && monthdata.map((element, idx) => {
                                                return <RadioButton ecId={`${this && this.props && this.props.ecId || ''}_RadioButton@88trq4@month${element.label}`} value={element.label}>{element.value}</RadioButton>
                                            })}
                                        </RadioGroup>}
                                        {type1 == 2 && <RadioGroup ecId={`${this && this.props && this.props.ecId || ''}_RadioGroup@icrb9x`} onChange={(e) => this.monthOnChange(e.target.value)}
                                                                   value={nowseason} style={{verticalAlign: "bottom"}}>
                                            {seasondata && seasondata.length > 0 && seasondata.map((element, idx) => {
                                                return <RadioButton ecId={`${this && this.props && this.props.ecId || ''}_RadioButton@8j95qf@season${element.label}`} value={element.label}>{element.value}</RadioButton>
                                            })}
                                        </RadioGroup>}
                                    </span>
                                </div>
                                <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@55ca8z`}
                                    comsWeaTableStore={tableStore}
                                    hasOrder
                                    needScroll
                                    onOperatesClick={this.onOperatesClick} //右键菜单操作
                                />
                                <AccessResultSend ecId={`${this && this.props && this.props.ecId || ''}_AccessResultSend@75uwet`}/>
                            </WeaLeftRightLayout>
                        </WeaRightMenu>
                    </div>
                    <AccessAgent ecId={`${this && this.props && this.props.ecId || ''}_AccessAgent@tqqtoo`} ref={"accessAgent"}/>
                </Spin>
            </div>
        )
    }

    //获取菜单
    getMenus = () => {
        const {getAccessResultListData, getAccessResultExportData} = this.store;
        return [{
            key: '0',
            icon: <i className='icon-coms-search'/>,
            content: getLabel('388113', '搜索'),
            onClick: getAccessResultListData,
        }, {
            key: '1',
            icon: <i className="icon-coms-export"/>,
            content: getLabel(510071, '导出成绩'),
            onClick: getAccessResultExportData,
        }, {
            key: '10',
            icon: <i className="icon-coms-Custom"/>,
            content: getLabel('32535', '显示列定制'),
            onClick: this.showColumn,
        }];
    }

    //显示列定制
    showColumn = () => {
        const {tableStore} = this.store;
        tableStore.setColSetVisible(true);
        tableStore.tableColSet(true);
    };

    //获取button
    getButtons = (ecId) => {
        const {cansend, changeSend, getAccessResultExportData, exportLoading} = this.store;
        let buttons = [<Button ecId={`${ecId}_Button@zdb738@assessagent`} type={"primary"} onClick={() => this.refs.accessAgent.wrappedInstance.doShow(true)}>{getLabel('519370', '考核代理')}</Button>];
        if (cansend) {
            buttons.push(<Tooltip ecId={`${ecId}_Tooltip@o4kxr1@sendremind`} title={getLabel(510005, '发送提醒')}>
                <Button ecId={`${ecId}_Button@6v0eqe@sendremind`} type='primary'
                        onClick={changeSend}>
                    {getLabel(501480, '提醒')}
                </Button>
            </Tooltip>);
        }
        buttons.push(<Tooltip ecId={`${ecId}_Tooltip@9fu13g@exportscore`} title={getLabel(510071, '导出成绩')}>
            <Button ecId={`${ecId}_Button@ylion0@exportscore`} type='primary' loading={exportLoading}
                    onClick={getAccessResultExportData}>
                {getLabel(510071, '导出成绩')}
            </Button>
        </Tooltip>)
        return buttons;
    }

    //点击节点
    treeNodeClick = (event, ids, selectedKeys, nodes) => {
        let {onMoreSearchChange, getAccessResultListData} = this.store;
        let {name, type, id} = nodes[0];
        if (type == 3) {
            onMoreSearchChange({
                hrmids: id,
                hrmnames: name,
                departmentids: null,
                departmentnames: null,
                subcompanyids: null,
                subcompanynames: null
            });
        } else if (type == 2) {
            onMoreSearchChange({
                hrmids: null,
                hrmnames: null,
                departmentids: id,
                departmentnames: name,
                subcompanyids: null,
                subcompanynames: null
            });
        } else if (type == 1) {
            onMoreSearchChange({
                hrmids: null,
                hrmnames: null,
                departmentids: null,
                departmentnames: null,
                subcompanyids: id,
                subcompanynames: name
            });
        }
        getAccessResultListData();
    }

    //点击人员
    onPersonClick = (hrmId, hrmname) => {
        this.store.onMoreSearchChange({
            hrmids: hrmId,
            hrmnames: hrmname,
            departmentids: null,
            departmentnames: null,
            subcompanyids: null,
            subcompanynames: null
        });
        this.store.getAccessResultListData();
    }

    //表格每行右侧菜单操作
    onOperatesClick = (record, index, operate, flag)=> {
        if (operate.index === '0') {
            //查看
            if (record.scoreid != "") {
                window.open("/spa/workrelate/static/index.html#/main/workrelate/performance/accessView?scoreid=" + record.scoreid);
            } else {
                window.open("/spa/workrelate/static/index.html#/main/workrelate/performance/accessView?resourceid=" + record.hrmid + "&year=" + this.store.queryParams.year + "&type1=" + this.store.queryParams.type1 + "&type2=" + this.store.queryParams.type2);
            }
        }
    }

    //查询类型变动
    typeOnChange(value) {
        let type;
        if (value == 3 || value == 4) {
            type = "";
        } else {
            let time = new Date().getMonth();
            if (value == 1) {
                if (time == 0) {
                    type = 12;
                } else {
                    type = time;
                }
            } else if (value == 2) {
                if (time == 0) {
                    type = this.getQuarterByMonth(12);
                } else {
                    type = this.getQuarterByMonth(time);
                }
            }
        }
        this.store.onMoreSearchChange({type1: value, type2: type});
        this.store.getAccessResultListData();
    }

    getQuarterByMonth(month) {
        //下面是几个if
        if (month >= 1 && month <= 3)
            return 1;
        if (month >= 4 && month <= 6)
            return 2;
        if (month >= 7 && month <= 9)
            return 3;
        if (month >= 10 && month <= 12)
            return 4;
    }

    //月份变动
    monthOnChange(value) {
        this.store.onSearchChange(value, 'type2');
        this.store.getAccessResultListData();
    }

    //年份变动
    yearOnChange(value) {
        this.store.onSearchChange(value, 'year');
        this.store.getAccessResultListData();
    }

    //高级搜索条目
    getSearchsAd() {
        let {statusData, includesubData, includedeptData, queryParams, onSearchChange, onMoreSearchChange, hrmData, subcompanyData, departmentData} = this.store
        let items = [];
        items.push({
            com:
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@uao4f7@status`} label={getLabel(23247, '状态')} ratio1to2>
                    <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@n0eiqc@status`}
                        value={queryParams.status}
                        options={statusData}
                        onChange={(val) => onSearchChange(val, 'status')}
                    />
                </WeaFormItem>
        });
        items.push({
            com:
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@z1r2z2@achievement`} label={getLabel(15657, '成绩')} ratio1to2>
                    <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@9omr7u@achievement`}>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@t2yw2e@achievement`} span={7}>
                            <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@laa6uu@minresult`}
                                value={queryParams.minresult}
                                precision={2}
                                onChange={(val) => onSearchChange(val, 'minresult')}
                            />
                        </Col>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@yab9rc@achievement1`} span={2}>
                            <div style={{"text-align": "center"}}>--</div>
                        </Col>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@j0x9rj@maxresult`} span={7}>
                            <WeaInputNumber ecId={`${this && this.props && this.props.ecId || ''}_WeaInputNumber@e4ol6y@maxresult`}
                                value={queryParams.maxresult}
                                precision={2}
                                onChange={(val) => onSearchChange(val, 'maxresult')}
                            />
                        </Col>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@2pbkx3@isreset`} span={8}>
                            <div style={{marginLeft: 30}}>
                                <WeaCheckbox ecId={`${this && this.props && this.props.ecId || ''}_WeaCheckbox@evhf6o@isreset`}
                                    value={queryParams.isreset}
                                    onChange={(val) => onSearchChange(val, 'isreset')}/>
                                <span style={{marginRight: 10}}>{getLabel('509099', '有更新')}</span>
                            </div>
                        </Col>
                    </Row>
                </WeaFormItem>
        });
        items.push({
            com:
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@fgni1l@person`} label={getLabel('30042', '人员')} ratio1to2>
                    <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@6buwt8@person`}
                        type={17}
                        isSingle={false}
                        title={getLabel(179, '人力资源')}
                        replaceDatas={hrmData}
                        onChange={(ids, names) => {
                            onMoreSearchChange({hrmids: ids, hrmnames: names});
                        }}
                    />
                </WeaFormItem>
        });
        items.push({
            com:
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@66q71y@subcompany`} label={getLabel('33553', '分部')} ratio1to2>
                    <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@b0gmj9@subcompany`}>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@v7v7ql@subcompany`} span={8}>
                            <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@kni0l6@includesub`}
                                value={queryParams.includesub}
                                options={includesubData}
                                onChange={(val) => onSearchChange(val, 'includesub')}
                            />
                        </Col>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@sn2a3p@subdata`} span={15} offset={1}>
                            <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@23q58y@subdata`}
                                type={164}
                                title={getLabel(33553, '分部')}
                                icon="icon-coms-hrm"
                                replaceDatas={subcompanyData}
                                onChange={(ids, names) => {
                                    onMoreSearchChange({subcompanyids: ids, subcompanynames: names});
                                }}
                            />
                        </Col>
                    </Row>
                </WeaFormItem>
        });
        items.push({
            com:
                <WeaFormItem ecId={`${this && this.props && this.props.ecId || ''}_WeaFormItem@3bb9v4@deptment`} label={getLabel(27511, '部门')} ratio1to2>
                    <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@3gp5af@deptment`}>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@skfdxt@deptment`} span={8}>
                            <WeaSelect ecId={`${this && this.props && this.props.ecId || ''}_WeaSelect@5hwdhv@includedept`}
                                value={queryParams.includedept}
                                options={includedeptData}
                                onChange={(val) => onSearchChange(val, 'includedept')}
                            />
                        </Col>
                        <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@hjvjr8@deptdata`} span={15} offset={1}>
                            <WeaBrowser ecId={`${this && this.props && this.props.ecId || ''}_WeaBrowser@6tgnmp@deptdata`}
                                type={4}
                                title={getLabel(27511, '部门')}
                                icon="icon-coms-hrm"
                                replaceDatas={departmentData}
                                onChange={(ids, names) => {
                                    onMoreSearchChange({departmentids: ids, departmentnames: names});
                                }}
                            />
                        </Col>
                    </Row>
                </WeaFormItem>
        });
        return <WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@s14p2y`} title={getLabel(32905, '常用条件')} items={items} showGroup={true} col={2}/>
    }

    getTabButtonsAd(ecId) {
        const {setShowSearchAd, resetSearchAd, advanceSearch} = this.store;
        return [
            (<Button ecId={`${ecId}_Button@sexo3h@search`} type="primary" onClick={advanceSearch}>{getLabel(388113, '搜索')}</Button>),
            (<Button ecId={`${ecId}_Button@nujif9@reset`} type="ghost" onClick={resetSearchAd}>{getLabel(2022, '重置')}</Button>),
            (<Button ecId={`${ecId}_Button@t3lihq@cancel`} type="ghost" onClick={() => setShowSearchAd(false)}>{getLabel(31129, '取消')}</Button>)
        ]
    }

};
